<?php TPL::output('m/header_meta.tpl.htm'); ?>
<style>
    .over-hide{
        text-overflow: -o-ellipsis-lastline;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        -webkit-box-orient: vertical;}
</style>
<div class="searchbox">
    <form id="search_form" action="m/search/" method="post">
        <header>
            <h1><img src="<?php echo G_STATIC_URL; ?>/mobile/images/logo.png"></h1>
            <span class="search" style="background: #f9f9f9;">
                <input name="q" type="text" id="index_search" placeholder="搜索" style="width:90%;font: 400 13.3333px Arial;text-indent: 5px;float: left;">
                <b onClick="$('#search_form').submit();" style='float: right;width: 15px;line-height: 27px;'>
                    <img src="<?php echo G_STATIC_URL; ?>/mobile/images/search.png">
                </b>
                </span>
            <a href="m/inbox/"><em><img src="<?php echo G_STATIC_URL; ?>/mobile/images/note.png"><i id=""><?php echo $this->user_info['inbox_unread'] + $this->user_info['notification_unread']; ?></i></em></a>
        </header>
    </form>
</div>
<div class="zlnav">
    <div class="row">
        <div class="col-xs-4 text-center">
            <a href="m/apply_column/" >
                <img src="/static/mobile/images/apply_zl.png" width="40%"><br>
                申请专栏
            </a>
        </div>
        <div class="col-xs-4 text-center">
            <a href="m/my_column/">
                <img src="/static/mobile/images/my_zl.png" width="40%"><br>
                我的专栏
            </a>
        </div>
        <div class="col-xs-4 text-center">
            <a href="m/article/">
                <img src="/static/mobile/images/all_wz.png" width="40%"><br>
                全部文章
            </a>
        </div>
    </div>
</div>
<div class="zlsy_list" id="demo">

</div>

<article class="qmeun">
    <span><img src="<?php echo G_STATIC_URL; ?>/mobile/images/edit.png"></span>
    <a href="m/addarticle/" class="q2" style="display: none;"><img src="<?php echo G_STATIC_URL; ?>/mobile/images/e2.png"></a>
    <a href="m/publish/" class="q3" style="display: none;"><img src="<?php echo G_STATIC_URL; ?>/mobile/images/e3.png"></a>
</article>
<div class="load_more" style="display: none;"><a href="#"><img src="<?php echo base_url();?>/static/mobile/images/loading.gif"></a></div>
<script src="<?php echo base_url();?>/static/mobile/layui/layui.js"></script>
<script type="text/javascript">
    layui.use('flow', function () {
        var $ = layui.jquery;
        var flow = layui.flow;
        var page= 1;
        var url = G_BASE_URL + '/column/ajax/fetch_column_list/';
        flow.load({
            elem: '#demo',
            end: 'SORRY~!没有了',
            done: function (page, next) {
                var lis = [];
                $.get(url + '?page=' + page, function (res) {
                        if ((res.rsm.list).length < 1) {
                            AWS.DingTalk.showToast('', '暂无更多内容');
                        }
                        var html = '';
                        if ((res.rsm.list).length >0) {
                        layui.each(res.rsm.list, function (index, item) {
                            html += '<div class="list-item"><div class="column-info" style="overflow: hidden">';
                            html += '<a href="m/column_details/id-' + item.column_id + '"><img src="'+item.column_pic+'" width="60" height="60" class="pull-left" style="width: 60px;border-radius: 5px" ></a>';
                            html += '<div class="pull-right text-info"><h3><a style="font-weight: 600" href="m/column_details/id-' + item.column_id + '">'+item.column_name.substr(0,18);

                            if(item.column_name.length>18){
                                html += '...';
                            }

                            html += '</a></h3>';
                            html += '<p class="text-color-999 over-hide"><a href="m/column_details/id-' + item.column_id + '">'+item.column_description.substr(0,38);
                            if(item.column_description.length>38){
                                html += '...';
                            }
                            html += '</a></p></div></div>';
                            html += '<div class="column-info-bottom text-color-999">';
                            html += '<ul class="row">';
                            html += '<li class="col-xs-4 text-center">文章：'+item.article_count+'</li>';
                            html += '<li class="col-xs-4 text-center">浏览：'+item.views_count+'</li>';
                            html += '<li class="col-xs-4 text-center">关注：'+item.focus_count+'</li>';
                            html += '</ul> </div> </div>';
                        });
                    }
                    lis.push(html);
                    next(lis.join(''), page < res.rsm.pages);
                }, 'json');
            }
        });
    });
</script>
<?php TPL::output('m/footer.tpl.htm'); ?>